@import "./reset.css";
@import "./common.scss";
.banner {
    background-image: url(../img/f1.png);
    background-position-y: -4.5vw;
    .middle {
        text-shadow: 0 0 .5vw #000;
    }
}

.about {
    .title {
        font-weight: bold;
        font-size: 1.47vw;
    }
    .eng {
        margin-bottom: 4.27vw;
    }
    .big {
        .box {
            .size {
                overflow: hidden;
                .height {
                    height: 100%;
                    display: flex;
                    flex-wrap: wrap;
                    justify-content: center;
                    align-items: center;
                    b {
                        width: 100%;
                        margin-bottom: -3vw;
                    }
                }
                &:hover .mark {
                    transition: 1s;
                    transform: translateY(-100%);
                }
                .mark {
                    width: 100%;
                    height: 100%;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    color: #fff;
                    flex-wrap: wrap;
                    background: rgba($color: #000000, $alpha: .6);
                }
            }
            display: flex;
            justify-content: space-between;
            flex-wrap: wrap;
            height: 34.06vw;
            width: 100%;
            font-size: 0px;
            margin-bottom: 5.73vw;
            .bg1 {
                width: 40%;
                height: 14.8vw;
                background-image: url(../img/f2.png);
                background-size: cover;
            }
            .bg2 {
                width: 31%;
                height: 14.8vw;
                background-image: url(../img/f7.png);
                background-size: cover;
            }
            .bg3 {
                width: 25.6%;
                height: 14.8vw;
                background-image: url(../img/f3.png);
                background-size: cover;
            }
            .bg4 {
                width: 32.5%;
                height: 11.67vw;
                background-image: url(../img/f4.png);
                background-size: cover;
            }
            .bg5 {
                width: 25.6%;
                height: 11.67vw;
                background-image: url(../img/f5.png);
                background-size: cover;
            }
            .bg6 {
                width: 40%;
                height: 11.67vw;
                background-image: url(../img/f6.png);
                background-size: cover;
            }
            .bg7 {
                width: 80%;
                height: 6.07vw;
                background: #e6e6e6;
                b {
                    display: block;
                }
            }
            .bg8 {
                width: 19%;
                height: 6.07vw;
                background: #e6e6e6;
                display: flex;
                justify-content: center;
                align-items: center;
                color: black;
            }
            .flex {
                display: flex;
                justify-content: center;
                align-items: center;
            }
            .textTop {
                height: 100%;
                padding-top: 1.5vw;
                padding-left: 1.87vw;
                b {
                    font-size: 0.93vw;
                    line-height: 2.57vw;
                    letter-spacing: 0.05vw;
                    color: #12151c;
                }
                p {
                    font-size: 0.67vw;
                    line-height: 1.2vw;
                    letter-spacing: 0.03vw;
                    color: #12151c;
                    word-wrap: break-word;
                }
            }
            .textCenter {
                width: 100%;
                text-align: center;
                word-wrap: initial;
                b {
                    font-size: 1.07vw;
                    line-height: 2.57vw;
                    letter-spacing: 0.05vw;
                }
                p {
                    font-size: 0.7vw;
                    line-height: 1.2vw;
                    letter-spacing: 0.03vw;
                    word-wrap: break-word;
                }
            }
            .textBottom {
                height: 100%;
                padding-top: 6vw;
                padding-left: 1.87vw;
                b {
                    font-size: 1.07vw;
                    line-height: 2.57vw;
                    letter-spacing: 0.05vw;
                }
                p {
                    font-size: 0.7vw;
                    line-height: 1.2vw;
                    letter-spacing: 0.03vw;
                    word-wrap: break-word;
                }
            }
        }
    }
}